<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>CSS基础选择器</title>
	<style type="text/css">
		*{margin: 0px;padding: 0px;text-align: center;line-height: 120px;}
		.all{width: 1000px;overflow: hidden;margin: 50px auto;}
		h1{color: aquamarine;width: 160px;height: 120px;border: 1px solid red;float: left;margin-right: 10px;background-color: aqua;}
		.one{color: bisque;width: 120px;height: 120px;border: 1px solid red;float: left;margin-right: 10px;background-color: chartreuse;}
		#two{color: gray;font-size: 20px;width: 120px;height: 120px;border: 1px solid red;float: left;margin-right: 10px;background-color: cornflowerblue;}
		p.three{color: yellow;width: 140px;height: 120px;border: 1px solid red;float: left;margin-right: 10px;background-color: darkmagenta;}
		p span{color: red;width: 120px;height: 120px;border: 1px solid red;float: left;margin-right: 10px;background-color: darkorange;}
		h2,p{color: orchid;width: 120px;height: 120px;border: 1px solid red;float: left;margin-right: 10px;background-color: deeppink;}
	</style>
</head>

<body>
	<div class="all">
	<h1>标记选择器</h1>
	<div class="one">类选择器</div>
	<div id="two">id选择器</div>
	<p class="three">标签指定式选择器</p>
	<p><span>后代选择器</span></p>
	<h2>并集选择器</h2>
	<p>并集选择器</p>
	</div>
</body>
<ml>
